import React, { Component } from 'react';
import { NavLink } from 'react-router-dom';
import '@/components/MusicHall/index/NewSong/NewSong.scss'
import Banner from '@/components/MusicHall/index/NewSong/Banner';
 class NewSong extends Component {
    constructor (props) {
        super(props)
        this.state = {
            bannerList : [],
            e: ''
        }
    }
    seek=(e)=>{
        console.log(e);
        fetch('https://api.bzqll.com/music/netease/search?key=579621905&s='+e+'&type=song&limit=9&offset=0')
            .then(res => res.json())
            .then(data => {
                // console.log(data.data)
                this.setState({
                    bannerList : data.data,
                    e: e
                })
            })        
    }
    render () {
        
        if (this.state.e === '') {
            this.seek('内地')
        }
        return (
          <div className='newsong-title'>
            <h3>新 歌 首 发</h3>
            <ul className='mod_index_tab'>
                <li>
                    <NavLink to="/musichall/index" onClick={(e)=>{this.seek('内地')}}>内地</NavLink>
                </li>
                <li>
                    <NavLink to="/musichall/index/gt" onClick={(e)=>{this.seek('港台')}}>港台</NavLink>
                </li>
                <li>
                    <NavLink to="/musichall/index/om" onClick={(e)=>{this.seek('欧美')}}>欧美</NavLink>
                </li>
                <li>
                    <NavLink to="/musichall/index/rb" onClick={(e)=>{this.seek('日本')}}>日本</NavLink>
                </li>
                <li>
                    <NavLink to="/musichall/index/hg" onClick={(e)=>{this.seek('韩国')}}>韩国</NavLink>
                </li>
            </ul>
            <Banner list={this.state.bannerList}/>
          </div>
        )
    }     
 }

export default NewSong;